import Vue from 'vue'
import Vuex from 'vuex'
import axios from 'axios'
import login from './login.js'
Vue.use(Vuex)

export default new Vuex.Store({
	state: {
		count: 0,
		msg: 'hello world',
		data: [], //数组数据
		todoList: [], //代办事项的数据对象
	},
	//是vue实例中的计算属性，可以对state中的数据进行加工处理再返回，依赖的数据变化，getter中的数据也会跟着变化
	getters: {
		showYe: state => {
			return '您的银行余额为' + state.count
		},
		showCd(state) {
			return '你迟到的次数' + state.count
		},
		//已完成
		doneList(state) {
			return state.todoList.filter(item => {
				return item.done
			})
		},
		//未完成
		unDoneList(state) {
			return state.todoList.filter(item => {
				return !item.done
			})
		}
	},
	//mutations用于变更共享数据，可以集中监控store的数据变化
	mutations: {
		//所有定义在mutations中的方法都必须定义1个形参接收全局的数据对象state
		addOne(state) {
			state.count++
		},
		jianOne(state) {
			state.count--
		},
		jianN(state, n) {
			state.count -= n
		},
		addN(state, n) {
			state.count += n
		},
		//改变数组内容
		changeData(state, res) {
			state.data = res
		},
		changeTodoList(state, res) {
			state.todoList = res
		},
		addTodoList(state, newItem) {
			var obj = {
				title: newItem,
				done: false
			}
			console.log(123, obj)
			state.todoList.push(obj)
		},
		deleteTodoList(state, title) {
			const i = state.todoList.findIndex(res => res.title === title)
			// 根据索引，删除对应的元素
			if (i !== -1) {
				state.todoList.splice(i, 1)
			}
		},
		test(state){
			state.msg='Helow'
			console.log('调用了')
		}

	},
	//处理异步操作
	actions: {
		//使用setTimeout模拟异步请求 发起axios请求去获取数据
		// changeAsync(context,res){//context代表的是当前store对象
		// 	setTimeout(()=>{
		// 		context.commit('changeData',res)
		// 	},500)
		// },
		// 从json文件中读取数据写入todoList数组中
		getTodoList(context, res) {
			axios.get('http://localhost:8080/todoList.json').then(res => {
				console.log(res)
				// this.todoList=res
				context.commit('changeTodoList', res)
			})
		}
		
	},
	modules: {
		//把导入的login模块注册为index.js的一个子模块
		login:login
	}
})